<template>
    <div id="app">
        <!--    <keep-alive>-->
        <Header></Header>
        <router-view/>
        <Footer></Footer>
        <BackTop></BackTop>
    </div>
</template>

<script>
    import Header from "./components/header"
    import BackTop from "./components/BackTop"
    import Footer from "./components/footer"

    export default {
        name: 'App',
        components: {
            Header,
            BackTop,
            Footer
        }
    }
</script>

<style>
    #app {
        font-family: 'Avenir', Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        text-align: center;
        color: #2c3e50;
    }

    .index-icon {
        width: 16px;
        height: 20px;
        vertical-align: middle;
        padding-bottom: 2px;
    }

    .index-icon2 {
        width: 19px;
        height: 15.8px;
        vertical-align: middle;
        margin-bottom: 2px;
    }

    .index-title {
        font-size: 22px;
        color: #333;
        margin-left: 10px;
        letter-spacing: .92px;
        vertical-align: middle;
    }

    .index-desc {
        font-size: 12px;
        color: #999;
        letter-spacing: .5px;
        vertical-align: middle;
    }

    /*.body-width {*/
    /*    width: 85%;*/
    /*    margin: auto;*/
    /*}*/
    .h-content {
        cursor: pointer;
        display: block;
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
        /*width: 12rem;*/

    }

    .content-desc {
        padding: 5px 5px 0 5px;
        text-align: left;
    }

    .content-seller {
        text-align: left;
        color: #bbb;
        font-size: .12rem;
    }

    .menu-header {
        margin-bottom: 20px;
    }

    /*index*/
    .c-img {
        width: 100%;
        height: 100%;
        display: block;
    }

    .c-img:hover {
        transform: scale(1.05);
        transition: .5s
    }

    .content-title {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 14px;
        font-weight: 500;
        width: 80%;
        text-align: left;
        padding: 2px 0 0 3px;
    }


    .content-seller-name {
        padding-bottom: 10px;
        font-size: 12px;
        font-weight: 500;
        line-height: 18px;
        float: left;
    }

    .content-seller-name /deep/ .ivu-avatar-small {
        width: 18px;
        height: 18px;
    }

    #hot-content {
        margin-top: 20px;
    }
    .gap {
        width: 85%;
        margin: 0 auto 0 auto;
        padding: 20px 0;
    }

</style>
